import type { DataFormItemProps, DataFormSchema } from '#/components/data-form/types';
import type { FieldProps, OnActionClickFn, RenderScope } from '#/components/data-table';

import { reactive } from 'vue';

export function useTable(onActionClick: OnActionClickFn): FieldProps[] {
    return [
        { prop: 'name', label: '名称', search: true, column: { width: 190 } },
        { prop: 'code', label: '编码', search: true, column: { width: 190 } },
        { prop: 'sequence', label: '显示序号', column: { width: 90 } },
        { prop: 'remark', label: '备注', column: { minWidth: 190 } },
        { prop: 'createTime', label: '创建时间', column: { width: 190 } },
        { prop: 'modifyTime', label: '修改时间', column: { width: 190 } },
        {
            column: {
                width: 150,
                render: [
                    { auth: 'system:role:edit', onClick: (scope: RenderScope) => onActionClick({ code: 'edit', scope }) },
                    { auth: 'system:role:remove', onClick: (scope: RenderScope) => onActionClick({ code: 'remove', scope }), type: 'danger' },
                ],
            },
        },
    ];
}

export function useForm(): DataFormSchema {
    const rules = reactive({
        name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
        code: [
            { required: true, message: '编码不能为空', trigger: 'blur' },
            { min: 5, max: 20, message: '编码长度应为 5-20 个字符', trigger: 'blur' },
            { pattern: /^\w+$/, message: '编码只能包含字母、数字、下划线', trigger: 'blur' },
        ],
    });
    const fields: DataFormItemProps[] = [
        { prop: 'id', primary: true },
        { prop: 'name', label: '名称' },
        { prop: 'code', label: '编码' },
        { prop: 'sequence', label: '序号' },
        { prop: 'remark', label: '备注' },
        { prop: 'checks', label: '继承角色', slot: 'checks' },
        { prop: 'menus', label: '权限分配', value: [] },
    ];
    return { rules, fields };
}
